<template>
	<view>	
		<u-index-list>
				<u-cell-group slot="header">
					<u-cell title="新的朋友">
						<u-avatar
							slot="icon"
							shape="square"
							size="35"
							icon="man-add-fill"
							fontSize="26"
							randomBgColor
							customStyle="margin: -3px 5px -3px 0"
						></u-avatar>
					</u-cell>
					<u-cell title="薇圈">
						<u-avatar
							slot="icon"
							shape="square"
							size="35"
							icon="chrome-circle-fill"
							fontSize="26"
							randomBgColor
							customStyle="margin: -3px 5px -3px 0"
						></u-avatar>
					</u-cell>
				</u-cell-group>
				<template	v-for="(item, index) in itemArr">
					<!-- #ifdef APP-NVUE -->
					<u-index-anchor :text="indexList[index]" :key="index"></u-index-anchor>
					<!-- #endif -->
					<u-index-item :key="index">
						<!-- #ifndef APP-NVUE -->
						<u-index-anchor :text="indexList[index]"></u-index-anchor>
						<!-- #endif -->
						<u-cell
							v-for="(item1, index1) in item"
							:key="index1"
							:title="item1.name"
							:border="index1 !== item.length - 1"
						>
							<u-avatar
								slot="icon"
								shape="square"
								size="35"
								:src="item1.url"
								customStyle="margin: -3px 5px -3px 0"
							></u-avatar>
						</u-cell>
					</u-index-item>
				</template>
			</u-index-list>
		<u-tabbar
			:value="value1"
			@change="change1"
			:fixed="true"
			:placeholder="false"
			:safeAreaInsetBottom="false"
		>
			<u-tabbar-item text="首页" icon="home" ></u-tabbar-item>
			<u-tabbar-item text="联系人" icon="list" ></u-tabbar-item>
			<u-tabbar-item text="薇聊" icon="more-circle"  badge="9"></u-tabbar-item>
			<u-tabbar-item text="我" icon="account" dot ></u-tabbar-item>
		</u-tabbar>
	</view>
</template>

<script>
	const indexList = () => {
		const indexList = []
		const charCodeOfA = 'A'.charCodeAt(0)
		for (let i = 0; i < 26; i++) {
			indexList.push(String.fromCharCode(charCodeOfA + i))
		}
		return indexList		
	}
	export default {
		data() {
			return {
				value1: 1,
				indexList: indexList(),
				urls: [
					'https://cdn.uviewui.com/uview/album/1.jpg',
					'https://cdn.uviewui.com/uview/album/2.jpg',
					'https://cdn.uviewui.com/uview/album/3.jpg',
					'https://cdn.uviewui.com/uview/album/4.jpg',
					'https://cdn.uviewui.com/uview/album/5.jpg',
					'https://cdn.uviewui.com/uview/album/6.jpg',
					'https://cdn.uviewui.com/uview/album/7.jpg',
					'https://cdn.uviewui.com/uview/album/8.jpg',
					'https://cdn.uviewui.com/uview/album/9.jpg',
					'https://cdn.uviewui.com/uview/album/10.jpg',
				],
				names: ["勇往无敌", "疯狂的迪飙", "磊爱可", "梦幻梦幻梦", "枫中飘瓢", "飞翔天使",
					"曾经第一", "追风幻影族长", "麦小姐", "胡格罗雅", "Red磊磊", "乐乐立立", "青龙爆风", "跑跑卡叮车", "山里狼", "supersonic超"
				]
			}
		},
		onLoad() {
			
		},
		methods: {
			change1(tab_num) {
				// if (tab_num === 1 || tab_num === 2) return uni.$u.toast('请您先登录')
				// else this.value1 = tab_num
				console.log(tab_num);
				if(tab_num === 0){
					uni.redirectTo({
					    url: '/pages/index/index'
					});
				}
				if(tab_num === 1){
					uni.redirectTo({
					    url: '/pages/contact/contact'
					});
				}
				if(tab_num === 2){
					uni.redirectTo({
					    url: '/pages/sheChat/sheChat'
					});
				}
				if(tab_num === 3){
					uni.redirectTo({
					    url: '/pages/user/user'
					});
				}
				this.value1 = tab_num
			},
		},
		computed: {
			itemArr() {
				return this.indexList.map(item => {
					const arr = []
					for (let i = 0; i < 10; i++) {
						arr.push({
							// 复制后解开下面两行注释
							name: this.names[uni.$u.random(0, this.names.length - 1)],
							url: this.urls[uni.$u.random(0, this.urls.length - 1)]
						})
					}
					return arr
				})
			}
		},
	}
</script>

<style>

</style>
